<div data-role="view" data-title="Maybanhang.Net" id="product-detail" data-layout="mobile-view"  data-reload="true"
data-show="load" > 
	<script type="text/javascript">
		var customerId;	
		function load(e) {		
			app.showLoading();
			var id = e.view.params.id;	
			customerId = id;	
			if (!id) return;
			$.ajax({
			  type: "GET",
			  url: "service/customer/" + id,		 
			  dataType : 'json', 
			  async: false,
			}).done(function( data ) {	
				app.hideLoading();		
			  $('#customerCode_edit').val(data.customerCode);
			  $('#customerFullName_edit').val(data.customerFullName);
			  $('#customerCategoryId_edit').val(data.customerCategoryId);
			  $('#phone_edit').val(data.phone);
			  $('#mobile_edit').val(data.mobile);
			  $('#email_edit').val(data.email);
			  $('#address_edit').val(data.address);
			  $('#description_edit').val(data.description);		
			  $('#customerImage').attr('src','site/customerImage/' + data.customerId);		  	
			});	
			
		}
	</script>
    <header data-role="header">
        <div data-role="navbar">
            <a id="back-button" class="nav-button" data-align="left" data-role="backbutton">Back</a>
            <span data-role="view-title"></span>
            <a data-align="right" data-role="button" class="nav-button" href='#index'>Home</a>            
        </div>
    </header>    
    <img id='customerImage' style="margin-left: auto; margin-right: auto;display: block;"></img>
    <form>
    <ul data-role="listview" data-style="inset">
    	<li>
    		<label>
    			Mã
    			 <input type="text"  id='customerCode_edit'/>
    		</label>    		    				
    	</li>
    	<li>
    		<label>
    			Tên
    			 <input type="text"  id='customerFullName_edit'/>
    		</label>
    	</li>    	
    	<li>
    		<label>
    			Nhóm
    			<select id='customerCategoryId_edit'>
    					<?php
    						$ezRestApi = new EzRestApi();	
							$accountId = UserInformation::getAccountId();
							$locationId = UserInformation::getLocationId();	
							$categories = $ezRestApi->getCustomerCategories($accountId, $locationId);
							reset($categories);
							while(list(,$value)=each($categories)) {
								echo "<option value='".$value['customerCategoryId']."'>".$value['categoryName']."</option>";											
							}
    					?>
                 </select>
    		</label> 
    	</li>
    	<li>
    		<label>
    			Điện thoại
    			 <input type="text"  id='phone_edit'/>
    		</label> 
    	</li> 
    	<li>
    		<label>
    			Di động
    			 <input type="text"  id='mobile_edit'/>
    		</label> 
    	</li> 
    	<li>
    		<label>
    			Email
    			 <input type="text"  id='email_edit'/>
    		</label> 
    	</li> 
    	<li>
    		<label>
    			Địa chỉ
    			 <input type="text"  id='address_edit'/>
    		</label> 
    	</li> 
    	<li>
    		<label>
    			Mô tả
    			 <input type="text"  id='description_edit'/>
    		</label> 
    	</li>    	
    </ul>    
    </form>
    <a class="button" data-role="button" style="display: block; margin: 2em; text-align: center;" data-click="save_customer_click">Lưu</a>
    
    <script>
	    function save_customer_click(e) {
	    	
	        customer = {
	        	"CustomerId":customerId,
				"CustomerFullName":$('#customerFullName_edit').val(),
				"CustomerCode":$('#customerCode_edit').val(),
				"Phone":$('#phone_edit').val(),
				"Mobile":$('#mobile_edit').val(),
				"Email":$('#email_edit').val(),
				"Address":$('#address_edit').val(),
				"Description":$('#description_edit').val(),
				"CustomerCategoryId":$('#customerCategoryId_edit').val(),				
			};
			
			$.ajax({
			  type: "PUT",
			  url: "service/customer/save" ,		 
			  dataType : 'json', 
			  data:JSON.stringify(customer),
			  async: false,
			}).done(function( data ) {			
			  app.navigate("#:back");
			});	
			
	    }
	</script>
</div>